<template>
  <div class="myfooter">
    <div class="tip">
      <a-tooltip placement="top">
        <template #title>
          <img :src="qqImg" alt="QQ二维码" width="180" height="180" />
        </template>
        <span class="tool_hover">
          <qq-outlined />
          联系作者
        </span>
      </a-tooltip>
      <a-tooltip placement="top">
        <template #title>
          <span
            >本站部分资源均来源于网络，仅供学习参考，如有侵权，非常抱歉，请立即联系作者删除！</span
          >
        </template>
        <span class="tool_hover">
          <info-circle-outlined />
          免责声明
        </span>
      </a-tooltip>
    </div>
    <div>Code cool ©2022 Created by Decadei</div>
  </div>
</template>

<script setup>
import { InfoCircleOutlined, QqOutlined } from "@ant-design/icons-vue";
import qqImg from "../assets/QQ.png";
</script>

<style scoped>

.myfooter {
  text-align: center;
  color: rgba(0, 0, 0, 0.45);
  max-width: 1366px;
  margin: 0 auto;
}
.myfooter .tip {
  padding: 5px 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.myfooter .tip .tool_hover{
  margin-right: 40px;
}
.tool_hover {
  transition: all 0.3s;
}
.tool_hover:hover {
  cursor: pointer;
  color: black;
}
.myfooter .tip .tool_hover:last-child{
  margin-right: 0;
}

</style>